<!doctype html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../assert_selection.js"></script>
<script>
    test(() => assert_selection(
        '<div contenteditable>here is <i>some|</i> text</div>',
        selection => {
            for (var i = 0; i < 5; ++i)
                selection.document.execCommand('delete');
            for (var i = 0; i < 4; ++i)
                selection.document.execCommand('insertText', false, 'x');
        },
        '<div contenteditable>here isxxxx|\u{00A0}text</div>'),
        'Delete all styled characters and previous character then typing character does not keep style');

    test(() => assert_selection(
        '<div contenteditable>here is <i>some|</i> text</div>',
        selection => {
            for (var i = 0; i < 4; ++i)
                selection.document.execCommand('delete');
            for (var i = 0; i < 4; ++i)
                selection.document.execCommand('insertText', false, 'x');
        },
        '<div contenteditable>here is <i>xxxx|</i>\u{00A0}text</div>'),
        'Delete all styled characters then typing character keeps style');

    test(() => assert_selection(
        '<div contenteditable>here is <i>some|</i> text</div>',
        selection => {
            for (var i = 0; i < 3; ++i)
                selection.document.execCommand('delete');
            for (var i = 0; i < 4; ++i)
                selection.document.execCommand('insertText', false, 'x');
        },
        '<div contenteditable>here is <i>sxxxx|</i>\u{00A0}text</div>'),
        'Delete some styled characters then typing character keeps style');

    test(() => assert_selection(
        '<div contenteditable>|</div>',
        selection => {
            selection.document.execCommand('insertText', false, 'abc');

            selection.document.execCommand('bold');
            selection.document.execCommand('insertText', false, 'def');

            selection.document.execCommand('italic');
            selection.document.execCommand('insertText', false, 'ghi');

            selection.document.execCommand('bold'); // disable bold
            selection.document.execCommand('insertText', false, 'jkl');

            selection.document.execCommand('italic'); // disable italic
            selection.document.execCommand('insertText', false, 'mno');
        },
        '<div contenteditable>abc<b>def</b><i style><b>ghi</b>jkl</i>mno|</div>'),
        'Nested styles and disabling styles');

    test(() => assert_selection(
        '<div contenteditable>here is <i>^some|</i> text</div>',
        'insertText abcd',
        '<div contenteditable>here is <i>abcd|</i> text</div>'),
        'Replace selection keeps style');
</script>
